<template xmlns="http://www.w3.org/1999/html">
  <div>
    <h1>你好{{eName}}</h1>
    <input @blur=getEmpNo01 type="text" v-model="empNo" >  <br>
    <button @click="getStr">getString</button>  <br>
    <button @click="getCom">getCommodity</button>  <br>
    <button @click="getMon">getManufacturer</button>  <br>
    <h2>{{str}}</h2>
  </div>
</template>

<script>
import {getCommodity, getEmpNo, getManufacturer, getString} from '@/api/ajax.js'
export default {
  name: "Ajax",
  data() {
    return{
      empNo: 7900,
      eName: '',
      str: '',
    }
  },
  methods: {
    async getEmpNo01() {
      /*getEmpNo(this.empNo).then((res) => {
        console.log(res)
        this.eName = ","+res.data.toLowerCase();
          }*/
      let {data} = await getEmpNo(this.empNo);
      console.log(data);
      this.eName = '，' + data.ename.toLowerCase() + '，您的工资是'+ data.sal + '元。';
    },
    async getStr() {
      let {data} = await getString();
      this.str = data;
    },
    async getCom() {
      let {data} = await getCommodity({commodityName: '显示器1'});   // 这个data是一个list集合
      data.forEach(commodity => {
        console.log(commodity)  // commodity是一个对象
      })
    },
    async getMon() {
      let {data} = await getManufacturer({manufacturerName: '5465'});   // 这个data是一个对象
      console.log(data);
    }
  }
}
</script>

<style scoped>

</style>
